import {Http} from '@angular/http';
import {NgLayer, NgLayerRef} from 'ng2-layer';
import {ViewContainerRef} from "@angular/core";
import {Component,ViewContainerRef, Injectable}  from '@angular/core';
import {FormsModule}  from '@angular/forms';

/**
 * 左侧菜单部分
 */
@Component({
	selector: '.category',
	templateUrl: 'template/router/indexSetting.html'
})
export class IndexSettingComp {
	indexData:any={};
	
	constructor(private http:Http, private layer:NgLayer, private parent:ViewContainerRef){
		http.get({
			search:{
				m:"Admin",
				c:"ApiSchool",
				a:"initSetHtmlInfo"
			}
		}).then((data)=>{
			this.indexData = data.data;
		});
	}
	
	//保存首页数据
	save(){
		this.http.post({
			search:{
				m:"Admin",
				c:"ApiSchool",
				a:"saveSetHtmlInfo"
			},
			body:this.indexData
		}).then((data)=>{
			this.indexData = data.data;
		});
	}
	
	/**
	 * 
	 */
	browserImg(){
		this.layer.dialog({
			title:"选择banner图片",
			parent:this.parent,
			dialogComponent:BrowserImgComp,
			imports:[FormsModule],
			data:{parent:this}
		});
	}
}

@Component({
	templateUrl:"template/dialog/browserImage.html"
})
class BrowserImgComp {
	selectData:any = null;
	file:any = null;
	
	constructor(private http:Http){}
	
	//上传banner图片
	upload(){
		let payload = new FormData();
			
		payload.append("avatar_file", this.file, this.file.name);
		payload.append("avatar_data", JSON.stringify({
			x:this.selectData.x,
			y:this.selectData.y,
			width:this.selectData.w,
			height:this.selectData.h
		}));
		payload.append("avatar_src", "");
		
		this.http.post({
			search:{
				m:"Home",
				c:"Image",
				a:"uploadImg",
				type:"banner"
			},
			body:payload,
			headers:{"Content-Type":null}
		}).then((data)=>{
			this.indexData = data.data;
		});
	}
	
	//预览图片
	previewImage(e){
		let files = e.target.files;
		
		if(files.length>0){
			this.file = files[0];
			
			let reader = new FileReader();
			reader.onload = (e) => {
				let img = document.getElementById("bannerImageCut");
				img.src = e.target.result;
				
				let jscrop;
				$('#bannerImageCut').Jcrop({
					onChange: ()=>{
						this.selectData = jscrop.tellSelect();
					},
					onSelect: ()=>{},
					aspectRatio: 3 / 1
				}, function(){
					jscrop = this;
				});
			};
			reader.readAsDataURL(this.file)
		}
	}
}
